.property-container {
	width: 100%;
	height: 100%;
	.dataScreen {
		background: #0d0e16;
		position: fixed;
		top: 50%;
		left: 50%;
		z-index: 999;
		display: flex;
		flex-direction: column;
		overflow: hidden;
		// transition: transform 0.3s;
		transform-origin: left top;
		.property-main {
			position: absolute;
			top: 110px;
			height: 90%;
			display: flex;
			width: 100%;
			padding: 17px 27px 17px;
			background: url("@/assets/screenImg/leaderImg/leaderBg.png") no-repeat;
			background-repeat: no-repeat;
			background-attachment: fixed;
			background-position: center;
			background-size: 100% 100%;
			.dataScreen-lf {
				width: 28%;
				height: 100%;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				background: url("@/assets/screenImg/commonImg/leftBg.png") no-repeat;
				background-size: 100% 100%;
				.lf-top,
				.lf-second,
				.lf-third,
				.lf-bottom {
					position: relative;
					width: 100%;
				}
				.lf-top {
					height: 19%;
					display: flex;
					flex-direction: column;
					.lf-top-cn {
						flex: 1;
						display: flex;
						flex-direction: column;
						.project-chartBox {
							flex: 1;
							width: 100%;
						}
					}
				}
				.lf-second {
					height: 25%;
					display: flex;
					flex-direction: column;
					.lf-second-cn {
						flex: 1;
						.second-box {
							display: flex;
							flex-wrap: wrap;
							margin: 0 10px;
							padding-top: 10px;
							.second-item {
								width: 50%;
								display: flex;
								justify-content: center;
								align-items: center;
								.icon-item {
									img {
										background: url("@/assets/screenImg/leaderImg/starsBg.gif")
											no-repeat;
										background-size: 80% 70%;
									}
								}
								.desc-text {
									> div {
										&:nth-child(1) {
											white-space: nowrap;
										}
										&:nth-child(2) {
											span {
												&:nth-child(1) {
													font-size: 24px;
													font-family: SourceHanSansCN-Bold, SourceHanSansCN;
													font-weight: bold;
													color: #ffffff;
													line-height: 36px;
													letter-spacing: 2px;
													text-shadow: 0px 0px 4px #36e3e3;
												}
												&:nth-child(2) {
													margin-left: 10px;
												}
											}
										}
									}
								}
								&:nth-child(3) {
									.desc-text {
										> div {
											&:nth-child(2) {
												span {
													&:nth-child(1) {
														text-shadow: 0px 0px 4px #ff4b4b;
													}
												}
											}
										}
									}
								}
							}
						}
					}
				}
				.lf-third {
					height: 27%;
					display: flex;
					flex-direction: column;
					.lf-third-cn {
						flex: 1;
						position: relative;
						.third-item {
							position: absolute;
							border-radius: 50%;
							display: flex;
							justify-content: center;
							align-items: center;
							&::before {
								content: "";
								display: block;
								position: absolute;
								width: 88%;
								padding-bottom: 88%;
								border-radius: 50%;
								box-shadow: 0px 0px 5px 0px #0077ff;
								border: 1px solid #9ecbff;
							}
							&::after {
								content: "";
								display: block;
								position: absolute;
								width: 100%;
								padding-bottom: 100%;
								border-radius: 50%;
								border: 1px solid rgba(0, 119, 255, 0.2);
							}
							.border-box {
								display: flex;
								flex-direction: column;
								justify-content: center;
								align-items: center;
								.title-item {
									font-size: 12px;
									font-family: PingFangSC-Regular, PingFang SC;
									font-weight: 400;
									color: #d3e3ff;
									line-height: 17px;
									text-shadow: 0px 0px 2px #0077ff, 0px 0px 20px #0077ff;
									span {
										display: flex;
										flex-direction: column;
										justify-content: center;
										align-items: center;
									}
								}
								.num-item {
									margin-top: 5px;
								}
							}
							&:nth-child(1) {
								left: 12%;
								top: 6%;
								width: 21%;
							}
							&:nth-child(2) {
								left: 37%;
								top: 18%;
								width: 27%;
								&::before {
									box-shadow: 0px 0px 5px 0px #00d5ff;
									border: 1px solid #80cedd;
								}
								&::after {
									border: 1px solid rgba(0, 213, 255, 0.2);
								}
								.border-box {
									.title-item {
										color: #a1f0ff;
										text-shadow: 0px 0px 2px #00d5ff, 0px 0px 20px #00d5ff;
									}
								}
							}
							&:nth-child(3) {
								left: 70%;
								top: 12%;
								width: 25%;
							}
							&:nth-child(4) {
								left: 19%;
								bottom: 0%;
								width: 23%;
								.border-box {
									.title-item {
										color: #ffda3a;
										text-shadow: 0px 0px 2px #0077ff, 0px 0px 20px #0077ff;
									}
								}
							}
							&:nth-child(5) {
								left: 58%;
								bottom: 0%;
								width: 20%;
								.border-box {
									.title-item {
										color: #ffd0d0;
										text-shadow: 0px 0px 2px #ff4b4b, 0px 0px 20px #ff4b4b;
									}
								}
							}
						}
					}
				}
				.lf-bottom {
					flex: 1;
					display: flex;
					flex-direction: column;
					.lf-bottom-cn {
						flex: 1;
						display: flex;
						flex-direction: column;
						padding-bottom: 3%;
						.input-box {
							display: flex;
							justify-content: center;
							justify-content: flex-start;
							align-items: center;
							padding: 0 5%;
							padding-bottom: 2%;
							> span {
								color: #d3e3ff;
								letter-spacing: 5px;
								margin-right: 10px;
							}
							:deep(.selectTool) {
								width: 80%;
								background: url("@/assets/screenImg/commonImg/下拉选择背景.png")
									no-repeat;
								background-size: 100% 100%;
								.select-trigger {
									.el-input {
										height: 28px;
										.el-input__wrapper.is-focus {
											box-shadow: 0 0 0 0.00521rem #4092f7 inset !important;
										}
										.el-input__wrapper {
											background-color: transparent;
											box-shadow: none;
											.el-input__inner {
												text-align: center;
												color: rgba(187, 209, 227, 0.73);
											}
											.el-input__inner::placeholder {
												color: rgba(187, 209, 227, 0.73);
											}
											.el-select__icon {
												color: #56caff !important;
											}
										}
									}
								}
								.el-select .el-input.is-focus .el-input__wrapper {
									box-shadow: 0 0 0 0.00521rem #4092f7 inset !important;
								}
								.screen-select-popper-style {
									.el-select-dropdown {
										background: rgba(21, 43, 94, 0.3);
										.el-select-dropdown__item {
											background-color: transparent;
											color: #4092f7;
											&::marker {
												display: none !important;
											}
										}
										.el-select-dropdown__item.hover {
											color: #36e3e3 !important;
											background-color: transparent;
										}
										.el-select-dropdown__item.selected {
											color: #4092f7;
										}
									}
									.el-popper__arrow::before {
										border: 0.2px solid #4092f7 !important;
										background-color: #4092f7 !important;
									}
								}
								.screen-select-popper-style.is-light {
									border: none;
									background-color: rgba(7, 14, 24, 0.9);
								}
							}
						}
						.table-box {
							flex: 1;
							padding: 0 20px;
							:deep(.el-table) {
								background: none;
								.el-table__inner-wrapper {
									&::before {
										height: 0;
									}
								}
								.table-head {
									background: rgba(21, 77, 160, 0.2);
									.el-table__cell {
										padding: 5px 0 !important;
										background: none;
										border: none;
										.cell {
											color: #d4edfd !important;
											font-weight: 400 !important;
											text-align: center;
										}
									}
								}
								.table-row {
									background: none;
									.el-table__cell {
										padding: 5px 0 !important;
										border: none;
										.cell {
											color: rgba(216, 240, 255, 0.8) !important;
											text-align: center;
											.el-button {
												color: #36e3e3 !important;
												span {
													border-bottom: 1px solid #36e3e3;
													padding-bottom: 3px;
												}
											}
										}
									}
									&:hover td.el-table__cell {
										background: none !important;
									}
									&:hover {
										background: linear-gradient(
											270deg,
											rgba(26, 123, 230, 0) 0%,
											rgba(69, 193, 255, 0.8) 100%
										);
									}
								}
							}
						}
					}
				}
			}
			.dataScreen-ct {
				width: 50%;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				height: 100%;
				.ct-top {
					flex: 1;
					.ct-top-cn {
						height: 100%;
						padding: 20px 0;
						.ct-top-line1 {
							display: flex;
							justify-content: space-around;
							align-items: center;
							.line1-item {
								width: 45%;
								background: url("@/assets/screenImg/projectImg/center/border1.png")
									no-repeat;
								background-size: 100% 100%;
								display: flex;
								justify-content: left;
								align-items: center;
								padding: 10px 30px;
								.left-icon {
									flex: 1;
									margin-right: 3%;
									img {
										background: url("@/assets/screenImg/projectImg/bottomBg.gif")
											no-repeat;
										background-size: 100%;
										background-position-x: center;
										background-position-y: bottom;
									}
								}
								.right-desc {
									flex: 4;
									> .img {
										display: flex;
										align-items: center;
										span {
											font-size: 12px;
										}
										div {
											display: flex;
											margin-left: 5px;
										}
									}
									> .text {
										margin-top: 5px;
										display: flex;
										align-items: flex-end;
									}
								}
							}
						}
						.ct-top-line2 {
							display: flex;
							justify-content: space-between;
							align-items: center;
							margin-top: 30px;
							.line2-item {
								flex: 1;
								background: url("@/assets/screenImg/projectImg/center/border2.png")
									no-repeat;
								background-size: 100% 100%;
								display: flex;
								justify-content: center;
								align-items: center;
								padding: 10px 20px;
								.left-icon {
									flex: 1;
									margin-right: 5%;
									img {
										background: url("@/assets/screenImg/commonImg/blueRound.gif")
											no-repeat;
										background-size: 120% 120%;
										background-position: center;
									}
								}
								&:last-child {
									.left-icon {
										img {
											background: url("@/assets/screenImg/commonImg/redRound.gif")
												no-repeat;
											background-size: 120% 120%;
											background-position: center;
										}
									}
								}
								.right-desc {
									flex: 5;
									> .img {
										display: flex;
										align-items: center;
										span {
											font-size: 12px;
										}
										div {
											display: flex;
											margin-left: 5px;
										}
									}
									> .text {
										margin-top: 5px;
										display: flex;
										align-items: flex-end;
									}
								}
							}
						}
					}
				}
				.ct-bottom {
					flex: 3;
					.ct-bottom-cn {
						background: #191d33;
						height: calc(100% - 60px);
						position: relative;
						.icon-item {
							position: absolute;
							cursor: pointer;
						}
					}
				}
			}
			.dataScreen-rg {
				width: 32%;
				height: 100%;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				background: url("@/assets/screenImg/commonImg/rightBg.png") no-repeat;
				background-size: 100% 100%;
				.dataScreen-top,
				.dataScreen-center,
				.dataScreen-bottom {
					position: relative;
					box-sizing: border-box;
					width: 100%;
				}
				.dataScreen-top {
					height: 36%;
					display: flex;
					flex-direction: column;
					.rg-top-cn {
						flex: 1;
						padding: 0px 10px 10px 10px;
					}
				}
				.dataScreen-center {
					height: 30%;
					display: flex;
					flex-direction: column;
					.rg-center-cn {
						flex: 1;
						padding: 0px 10px 10px 10px;
					}
				}
				.dataScreen-bottom {
					height: 34%;
					display: flex;
					flex-direction: column;
					.rg-bottom-cn {
						flex: 1;
						padding: 0px 10px 10px 10px;
					}
				}
			}
		}
	}
	// 表格滚动hover样式
	:deep(.dv-scroll-board) {
		.rows {
			.row-item {
				&:hover {
					background: linear-gradient(
						270deg,
						rgba(26, 123, 230, 0) 0%,
						rgba(69, 193, 255, 0.8) 100%
					);
				}
			}
		}
	}
}

.list-common {
	.item-head {
		padding: 5px 0px;
		background: url("@/assets/screenImg/projectImg/headBg.png") no-repeat;
		background-size: 100% 100%;
		text-align: center;
		span {
			font-weight: 500;
			&:nth-child(1) {
				font-size: 14px;
				color: #ffffff;
				line-height: 21px;
			}
			&:nth-child(2) {
				color: #56caff;
				font-size: 18px;
				line-height: 27px;
			}
			&.unit {
				font-size: 16px;
				color: #56caff;
				margin-left: 3px;
			}
		}
	}
	.item-content {
		width: 100%;
		height: 100%;
		padding: 10px 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		> div {
			width: 49%;
			height: 30%;
			margin-bottom: 1.5%;
			white-space: nowrap;
			display: flex;
			align-items: center;
			&:nth-child(2n) {
				margin-right: 0;
			}
			padding: 5px 15px;
			background: url("@/assets/screenImg/projectImg/state1.png") no-repeat;
			background-size: 100% 100%;
			text-align: left;
			&.green {
				background: url("@/assets/screenImg/projectImg/state2.png") no-repeat;
				background-size: 100% 100%;
			}
			&.yellow {
				background: url("@/assets/screenImg/projectImg/state3.png") no-repeat;
				background-size: 100% 100%;
			}
			&.red {
				background: url("@/assets/screenImg/projectImg/state4.png") no-repeat;
				background-size: 100% 100%;
			}
			span {
				font-weight: 500;
				&:nth-child(1) {
					font-size: 14px;
					color: #ffffff;
					line-height: 21px;
				}
				&:nth-child(2) {
					color: #56caff;
					font-size: 18px;
					line-height: 27px;
				}
				&.unit {
					font-size: 16px;
					color: #56caff;
					margin-left: 3px;
				}
			}
		}
	}
}

.numColor {
	font-size: 30px;
	font-family: AlibabaPuHuiTi-Bold, AlibabaPuHuiTi;
	font-weight: bold;
	color: #ffffff;
	line-height: 35px;
	text-shadow: 0px 1px 7px #ffda3a;
	&.normal {
		text-shadow: 0px 1px 7px #56caff;
	}
	&.abnormal {
		text-shadow: 0px 1px 7px #ff4b4b;
	}
	&.unit {
		font-size: 20px;
		margin-left: 5px;
	}
}

.textColor {
	font-size: 14px;
	color: #d3e3ff;
	line-height: 21px;
	letter-spacing: 2px;
}

.stateColor {
	font-size: 20px;
	font-weight: bold;
	font-family: Alibaba-PuHuiTi-H, Alibaba-PuHuiTi;
	color: #ecfcff;
	line-height: 16px;
	text-shadow: 0px 0px 4px #00cdff;
}
